

	var avger_div 				= 	$('.avger');
	var nickname_div 			= 	$('.nickname');
	var code_div 				= 	$('.code');
	var avger_size				= 	$("input[name='avger_size']");
	var nickname_font_size 		= 	$("input[name='nickname_font_size']");
	var nickname_font_color 	= 	$("input[name='nickname_font_color']");
	var code_size 				= 	$("input[name='code_size']");
	var avger_pos_x 			= 	$("input[name='avger_pos_x']");
	var avger_pos_y 			= 	$("input[name='avger_pos_y']");
	var nickname_pos_x 			= 	$("input[name='nickname_pos_x']");
	var nickname_pos_y 			= 	$("input[name='nickname_pos_y']");
	var code_pos_x 				= 	$("input[name='code_pos_x']");
	var code_pos_y 				= 	$("input[name='code_pos_y']");
	var font_color_text 		=   $("input[name='nickname_font_color_text']");

	$(function() {

		//初始化自定义参数
		
		if( custom_info == null ){

			//头像大小Input框显示,读取CSS宽度
			avger_size.val(avger_div.width());

			//二维码大小Input框显示
			code_size.val(code_div.width());

			//昵称字体大小Input框显示
			var font_size = parseInt(nickname_div.css("font-size"));
			nickname_font_size.val(font_size);
			nickname_div.css({"font-size":font_size/0.75});

			//昵称字体颜色Input框显示
			var color = nickname_div.css("color");
			nickname_font_color.val(rgb2hex(color));
			font_color_text.val(color.colorRgb());


			//读取头像位置,CSS预设值
			avger_pos_x.val(avger_div.position().left);
			avger_pos_y.val(avger_div.position().top);

			//读取昵称位置,CSS预设值
			nickname_pos_x.val(nickname_div.position().left);
			nickname_pos_y.val(nickname_div.position().top);

			//读取二维码位置,CSS预设值
			code_pos_x.val(code_div.position().left);
			code_pos_y.val(code_div.position().top);

		}else{

			//改变头像大小
			avger_div.width(custom_info.avger_size).height(custom_info.avger_size);

			//头像位置
			avger_div.css({
				"left":custom_info.avger_pos_x+"px",
				"top":custom_info.avger_pos_y+"px"
			});

			//改变昵称字体颜色,大小,昵称位置
			nickname_div.css({
				"fontSize":custom_info.nickname_font_size/0.75+"px",
				'color':custom_info.nickname_font_color,
				'left':custom_info.nickname_pos_x+"px",
				'top':custom_info.nickname_pos_y+"px",
			});

			nickname_font_color.val(rgb2hex(custom_info.nickname_font_color));
			font_color_text.val(custom_info.nickname_font_color.colorRgb());


			//改变二维码大小
			code_div.width(custom_info.code_size).height(custom_info.code_size);
			code_div.css({
				"left":custom_info.code_pos_x+"px",
				"top":custom_info.code_pos_y+"px"
			});
		}

		font_color_text.on('input',function(){
				nickname_div.css({"color":$(this).val()});
		});
		//头像绑定拖动元素
		var $avger = avger_div.draggabilly({
    		containment: '.app-design',
  		});

		$avger.on( 'dragEnd', function( event, pointer ) {
			var pos_x = parseInt(avger_div.css('left'));
			var pos_y = parseInt(avger_div.css('top'));
			avger_pos_x.val(pos_x);
			avger_pos_y.val(pos_y);
		});

		avger_pos_x.change(function(){
			var x = $(this).val();
			avger_div.css({"left":x+"px"});
		});
		avger_pos_y.change(function(){
			var y = $(this).val();
			avger_div.css({"top":y+"px"});
		});
		

		//昵称绑定拖动元素
		var $nickname = nickname_div.draggabilly({
    		containment: '.app-design',
  		});

		$nickname.on( 'dragEnd', function( event, pointer ) {
			var pos_x = parseInt(nickname_div.css('left'));
			var pos_y = parseInt(nickname_div.css('top'));
			nickname_pos_x.val(pos_x);
			nickname_pos_y.val(pos_y);
		});

		nickname_pos_x.change(function(){
			var x = $(this).val();
			nickname_div.css({"left":x+"px"});
		});
		nickname_pos_y.change(function(){
			var y = $(this).val();
			nickname_div.css({"top":y+"px"});
		});


		//二维码绑定拖动元素
		var $code = code_div.draggabilly({
    		containment: '.app-design',
  		});

		$code.on( 'dragEnd', function( event, pointer ) {
			var pos_x = parseInt(code_div.css('left'));
			var pos_y = parseInt(code_div.css('top'));
			code_pos_x.val(pos_x);
			code_pos_y.val(pos_y);
		});

		code_pos_x.change(function(){
			var x = $(this).val();
			code_div.css({"left":x+"px"})
		});
		code_pos_y.change(function(){
			var y = $(this).val();
			code_div.css({"top":y+"px"});
		});


		//头像大小Input框调整
		avger_size.change(function(){
			var size = $(this).val();
			avger_div.width(size).height(size);
		});


		//二维码大小Input框调整
		code_size.change(function(){
			var size = $(this).val();
			code_div.width(size).height(size);
		});

		//昵称字体大小Input框调整
		nickname_font_size.change(function(){
			var size = parseFloat($(this).val())/0.75;
			nickname_div.css({"fontSize":size+"px"});
		});

		//昵称字体颜色Input框调整
		nickname_font_color.change(function(){
			var color = $(this).val();
			font_color_text.val(color.colorRgb());
			nickname_div.css({"color":color});
		});

	});


	

	/*RGB格式转为16进制颜色*/
	function rgb2hex(rgb) {
	  if (rgb.charAt(0) == '#'){
	  	return rgb;
	  }
	    
	 
	  var ds = rgb.split(/\D+/);
	  var decimal = Number(ds[1]) * 65536 + Number(ds[2]) * 256 + Number(ds[3]);
	  return "#" + zero_fill_hex(decimal, 6);
	}

	function zero_fill_hex(num, digits) {
	  var s = num.toString(16);
	  while (s.length < digits)
	    s = "0" + s;
	  return s;
	}
	

	//-------------------------------------------------

	/*16进制颜色转为RGB格式*/
	String.prototype.colorRgb = function(){
	     var sColor = this.toLowerCase();
	     var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;
	     if(sColor && reg.test(sColor)){
	          if(sColor.length === 4){
	               var sColorNew = "#";
	               for(var i=1; i<4; i+=1){
	                    sColorNew += sColor.slice(i,i+1).concat(sColor.slice(i,i+1));    
	               }
	               sColor = sColorNew;
	          }
	          //处理六位的颜色值
	          var sColorChange = [];
	          for(var i=1; i<7; i+=2){
	               sColorChange.push(parseInt("0x"+sColor.slice(i,i+2)));    
	          }
	          return "RGB(" + sColorChange.join(",") + ")";
	     }else{
	          return sColor;    
	     }
	};